<!DOCTYPE html>
<html xmlns:th="http://www.thymeleaf.org">
<head th:replace="/common/template :: header(~{::title},~{::link},~{::style})">
</head>
<body>
<div class="layui-form timo-compile timo-detail-page">
    <form th:action="@{/settleAccount/pay}">
        <input type="hidden" name="id" th:if="${settleAccount}" th:value="${settleAccount.id}"/>
        <input type="hidden" name="accountType" th:if="${settleAccount}" th:value="${settleAccount.accountType}"/>
        <input type="hidden" name="accountAttr" th:if="${settleAccount}" th:value="${settleAccount.accountAttr}"/>
        <table class="layui-table timo-detail-table">
            <tbody>
            <tr>
                <th>结算单号</th>
                <td th:text="${settleAccount.settleNo}"></td>
                <th>结算日期</th>
                <td th:text="${settleAccount.createDate}"></td>
            </tr>
            <tr>
                <th>结算金额</th>
                <td th:text="${settleAccount.settleAmount}"></td>
                <th>结算状态</th>
                <td th:text="${settleAccount.settleStatus.desc}"></td>
            </tr>
            <tr>
                <th>结算类型</th>
                <td >手工结算</td>
                <th>手续费</th>
                <td th:text="${settleAccount.fee}"></td>
            </tr>
            <tr>
                <th>账户属性</th>
                <td th:text="${settleAccount.accountAttr.desc}"></td>
                <th>账户类型</th>
                <td th:text="${settleAccount.accountType.desc}"></td>
            </tr>
            <tr>
                <th>银行名称</th>
                <td th:text="${settleAccount.accountBankName}"></td>
                <th>开户网点</th>
                <td th:text="${settleAccount.accountBankAddr}"></td>
            </tr>
            <tr>
                <th>账号名称</th>
                <td th:text="${settleAccount.accountName}"></td>
                <th>银行卡号</th>
                <td th:text="${settleAccount.accountNo}"></td>
            </tr>
            </tbody>
        </table>
        <div class="layui-form-item layui-form-text">
            <label class="layui-form-label">打款金额</label>
            <div class="layui-input-block">
                <input class="layui-input" type="text" lay-verify="required|number|max" name="payAmount"  placeholder="请输入打款金额" th:value="${settleAccount.settleAmount/100.0}">
            </div>
        </div>
        <div class="layui-form-item timo-finally">
            <button class="layui-btn" id="settlePayBtn" lay-submit lay-filter="settlePay"><i class="fa fa-check-circle"></i>确认打款</button>
            <button class="layui-btn btn-secondary close-popup"><i class="fa fa-times-circle"></i>取消</button>
        </div>
    </form>
</div>
<script th:replace="/common/template :: script"></script>
<script type="text/javascript">
    layui.use(['element', 'form', 'layer'], function () {
        var $ = layui.jquery;
        var element = layui.element; //加载element模块
        var form = layui.form; //加载form模块
        var layer = layui.layer;
        form.verify({
            max:function (value, item) {
                var maxAmount = [[${settleAccount.settleAmount/100.0}]]
                if(maxAmount < value){
                    return "打款金额不能大于"+maxAmount;
                }
                if(value <= 0){
                    return "结算金额必须大于0"
                }
            },
        });
        form.on('submit(settlePay)', function(data){
            var url = data.form.action;
            var $btn = $("#settlePayBtn");
            $btn.prop("disabled", true);
            data.field.payAmount = data.field.payAmount*100;
            $.post(url, data.field, function (result) {
                $btn.removeProp("disabled");
                if (result.data == null) {
                    parent.layer.close(window.parent.layerIndex);
                    parent.$.fn.layTableSearch('settleAccountTable','settleAccountSearchFrom','/settleAccount/data');
                }
                $.fn.Messager(result);
            });
            return false;
        });
    });
</script>
</body>
</html>
